<template>
<div class="layerRtb layerRtb-threecolumn">
    <three-title :title="{name:'现场交底'}"></three-title>
    <div class="layerRtb-scroll thinScroll" v-scrollHeight = "18" >
       <div class="analyItem" v-for="(item, index) in discloseData" :key="index">
            <p class="analyItemTit tx-center">{{item.participantsRole | truncate(5)}}</p>
            <div class="analyItemCon">
                <div class="flex">
                    <div class="col-md-11">
                         <div class="clearfix">
                            <rx-viewer :images="item.photoList" class="fl">
                                <div class="clearfix">
                                    <div class="fl mr10" :option={}  v-for="(imgitem, imgindex) of item.photoList" :key="imgindex">
                                        <img :src="imgitem | smallImg(80, 80)" >
                                    </div>
                                </div>
                            </rx-viewer>
                            <rx-upload
                                :data="{id: item.id}"
                                :init="{class: 2, mime: 1}"
                                :elStyle="{width:'80px', height: '80px'}"
                                @success="successUpload" class="fl">
                                <div class="fl uiImgUpload uiImgUpload-gblock">
                                    <a href="javascript:">
                                        <span type="file" value="" class="file"></span>
                                        <em class="bgIcon file-ico"></em>
                                    </a>
                                </div>
                            </rx-upload>
                        </div>
                        <div class="clearfix mt10">
                            <textarea id="discloseDec" class="col-md-10" v-model="item.description" placeholder="请输入描述"></textarea>
                        </div>
                    </div>
                    <input type="button" class="uiBtn-small uiBtn-blue" value="确定" @click="submitButton(item.id)" >
                </div>
            </div>
        </div>
    </div>
    <!-- <div class="layerRtb-footer">
        <div class="analyItem">
            <p class="analyItemTit tx-center">综合</p>
            <div class="analyItemCon">
                <div class="tx-center">

                </div>
            </div>
        </div>
    </div> -->
</div>
</template>
<script>
export default {
    data () {
        return {
            discloseData: [
                {
                    id: 1,
                    participantsRole: '甲方',
                    participantsName: '温蓝',
                    participantsPhone: '15986523587',
                    description: '描述',
                    isJoin: 0,
                    photoList: []
                },
                {
                    id: 2,
                    participantsRole: '项目经理',
                    participantsName: '汪松牛',
                    participantsPhone: '13001974987',
                    description: '描述',
                    isJoin: 0,
                    photoList: []
                },
                {
                    id: 3,
                    participantsRole: '主案设计师',
                    participantsName: '温蓝',
                    participantsPhone: '13464930755',
                    description: '描述',
                    isJoin: 0,
                    photoList: []
                }
            ], // 交底数据
            buttonIsShow: false, // 按钮是否显示
            discloseDataClone: null, // 交底数据
            submitLength: 0 // 提交次数
        }
    },
    created () {
    },
    computed: {
    },
    methods: {
        // 上传图片
        successUpload (value) {
            const currentData = this.discloseData.filter((item) => { return item.id === Number(value.data.id) })
            if (currentData.length > 0) {
                const photoList = currentData[0].photoList
                this.$set(currentData[0], 'photoList', [...photoList, value.src])
            }
        }
    },
    watch: {
    }
}
</script>
